<template>
  <el-dialog title='查看'
             v-if="open"
             :visible.sync="open"
             :modal= true
             append-to-body
             width="95%"
  >
  <div class="app-container">
    <el-form :model="form" size="small" :inline="true" label-width="120px">
      <el-row>
        <el-col :span="6">
          <el-form-item label="报价单编号:" prop="quotationCode">
            <span>{{ form.quotationCode }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="报价时间:" prop="quotationTime">
            <span>{{ parseTime(form.quotationTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="供应商:" prop="vendorName">
            <span>{{ form.vendorName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="询价单编号:" prop="enquiryCode">
            <span>{{ form.enquiryCode }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="询价截止时间:" prop="enquiryDeadline">
            <span>{{ parseTime(form.enquiryDeadline, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="交货日期:" prop="deliveryDate">
            <span>{{ parseTime(form.deliveryDate, '{y}-{m}-{d}') }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="代理人:" prop="agentUserName">
            <span>{{ form.agentUserName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="供应商联系人:" prop="contact">
            <span>{{ form.contact }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="电话:" prop="contactTel">
            <span>{{ form.contactTel }}</span>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <div style="font-size: 21px;">报价明细</div>
      </el-col>
    </el-row>
    <el-table border :data="cgPurchaseQuotationLineList" ref="cgPurchaseQuotationLine" max-height="500"
              show-summary :summary-method="getSummaries">
      <el-table-column label="序号" align="center" type="index" width="50"/>
      <el-table-column label="物料编号" align="center" prop="itemCode" />
      <el-table-column label="物料名称"align="center" prop="itemName" />
      <el-table-column label="规格型号" align="center" prop="specification" />
      <el-table-column label="单位" align="center" prop="unitOfMeasure" />
      <el-table-column label="需求数量" align="center" prop="quantity" />
      <el-table-column label="供货数量" align="center" prop="supplyQuantity" />
      <el-table-column label="含税单价" align="center" prop="taxPrice" />
      <el-table-column label="税率" align="center" prop="tax" />
      <el-table-column label="不含税单价" align="center" prop="noTaxPrice" />
      <el-table-column label="含税金额" align="center" prop="taxAmount" />
      <el-table-column label="不含税金额" align="center" prop="noTaxAmount" />
      <el-table-column label="是否报价" align="center" prop="isQuotation">
        <template slot-scope="scope">
          <el-tag v-if="scope.row.isQuotation=='Y'">是</el-tag>
          <el-tag v-else>否</el-tag>
        </template>
      </el-table-column>
    </el-table>
    <div slot="footer" class="dialog-footer" style="text-align:center;margin-top: 20px;">
      <el-button type="info" @click="cancel">返 回</el-button>
    </div>
  </div>
  </el-dialog>
</template>

<script>
import {getQuotation} from "@/api/mes/cg/quotation";
export default {
  name: " QuotationInfoView",
  data() {
    return {
      open:false,
      title:null,
      // 遮罩层
      loading: true,
      // 添加的商品信息表格数据
      cgPurchaseQuotationLineList: [],
      // 表单参数
      form: {},
    };
  },
  created() {
  },
  methods: {
    init(id){
      getQuotation( id).then(response => {
        this.form = response.data;
        this.cgPurchaseQuotationLineList = response.data.cgPurchaseQuotationLineList;
        this.open = true;
      })
    },
    //商品小计
    getSummaries(param) {const {columns, data} = param;
      const sums = []; //声明变量
      let taxAmountIndexNum = 0;
      let noTaxAmountIndexNum = 0;
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        const values = data
          .filter(item => item.isQuotation === 'Y') // 过滤掉不参与计算的行
          .map(item => Number(item[column.property]));
        if (column.property === "taxAmount") {
          taxAmountIndexNum = index;
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr*100;
            } else {
              return prev;
            }
          }, 0);
          sums[index]=parseFloat(Number(sums[index])/100).toFixed(2);
          sums[index]+=' 元'
        } else if(column.property === "noTaxAmount"){
          noTaxAmountIndexNum = index;
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr*100;
            } else {
              return prev;
            }
          }, 0);
          sums[index]=parseFloat(Number(sums[index])/100).toFixed(2);
          sums[index]+=' 元'
        }else {
          sums[index] = '';
        }
      });

      return sums;
    },
    // 取消按钮
    cancel() {
      this.open = false;
    }
  }
};
</script>
